<template>
	<view>
		<view class="box-list">
			<view class="page-list" v-if="infoData.is_kol">
				<view class="tips">专场包含车系如下：</view>
				<view class="list-item" v-for="item in configList" :key="item.hid">
					<view class="left">
						<img  :src="item.cover" alt="">
					</view>
					<view class="middle">
						<view class="name">{{item.name}}</view>
						<view class="price">团购价:{{item.hidden_price}}</view>
					</view>
				</view>
			</view>
			
		</view>

	<view class="page"  v-if="!infoData.is_kol">
		<view class="big-bg">
			<img style="width: 100%;" mode="widthFix" src="../../static/image/g-bg.png" alt="" />
			<view class="up">
				<img style="width: 100%; height: 75rpx;" src="../../static/image/g-chang.png" alt="" />
				<view class="info">
					<image mode="widthFix" src="../../static/image/g-t-bg.png"></image>
					<view class="phone">
						<img class="laba" src="../../static/image/g-laba.png"/>
						
							<swiper class="swiper" circular :vertical="true" :autoplay="true"
										:interval="1500"	:duration="duration">
											<swiper-item v-for="item in infoData.sign_up_list" :key="item.phone">
												<view class="swiper-item num">{{item.name}}  {{item.phone}}</view>
											</swiper-item>
										</swiper>
						<view class="gu" >已报名</view>
					</view>
					<view class="group-info">
						<view class="title">{{infoData.name}}</view>
						<view class="dingwei" v-if="infoData.dealer_is_show">
							<view class="left">
								<img src="../../static/image/g-dingwei.png" alt=""/>
								<view class="time-name">{{infoData.dealer_name}}</view>
							</view>
							<view class="btn-text" v-if="isshowAllBtn">
								<view  v-if="!isShowbtn" @click="showCity">选择门店</view>
								<view v-if="isShowbtn" @click="changeDian">更换门店</view>
							</view> 
						</view>
						<view class="dingwei" v-if="!infoData.dealer_is_show">
							<view class="left">
								<img src="../../static/image/g-dingwei.png" alt=""/>
								<view class="time-name">{{dealerName}}</view>
							</view>
							<view class="btn-text">
								<view v-if="dealerName == '未选择购车城市'" @click="showCity">选择城市</view>
								<view v-if="dealerName != '未选择购车城市' && infoData.dealer_name != ''" @click="showCityAgin">更换城市</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<view class="car-data">
			
	
				<view class="scroll-box">
					
					<scroll-view
						scroll-x="true"
						:class="carList.length > 3 ? 'scroll-list' : 'scroll-short'"
						:scroll-into-view="toView"
						:scroll-left="scrollLeft"
						>
						<block v-for="(val,index) in carList" :key="val.hid">
							<view class="car-item" :id="'sv'+val.hid" @click="checkItem(val)">
										<view class="img-title">
											<img :src="val.cover" alt=""/>
											<view class="title">{{val.name}}</view>
											<view class="group-price">
												<view class="group">团购价 </view>
												<view class="price">{{val.hidden_price}}</view>
											</view>
										</view>
										<view class="check" v-if="val.isSelected == 1">
											<img src="../../static/image/ok.png" alt=""/>
										</view>
									</view>
							</block>
							
					</scroll-view>
					
					<view class="all-car" @click="showCar" v-if="carList.length >3">
						<view class="all">全部车系</view>
						<img src="../../static/image/箭头.png" alt=""/>
					</view>
				</view>
				<view class="phone-box">
					<view class="item" v-if="!isEmpower">
						<view class="left">手机号</view>
						
						<input name="input" class="middle" placeholder="请输入手机号" placeholder-style="color:#BEC0C4" v-model="phone" maxlength="11" type="number"  :clueType="clueType" @input="inputChange" ></input>
						<view class="right" v-if="phone == '' "><button class="btn" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumbers">获取手机号</button></view>
					</view>
					<view class="item" v-if="!isShow">
						<view class="left">验证码</view>	
						<input class="middle" type="number" v-model="sms_code" placeholder="请输入验证码" placeholder-style="color:#BEC0C4"></input>
						<view class="right">
							<button class="btn" @click="getSMS" v-if="!isSMS">获取验证码</button>
							<button class="btn" @click="getSMS" v-if="isSMS">{{countdown}}s</button>
						</view>
					</view>
					
				</view>
				<view class="btn-box">
					<view class="people">
						<view class="top">{{infoData.people_num}}</view>
						<view class="dao-time">
							
							<view class="red">{{hours}}</view>
							<view class="dian">:</view>
							<view class="red">{{minutes}}</view>
							<view class="dian">:</view>
							<view class="red">{{seconds}}</view>
							<view class="dian">:</view>
							<view class="red">{{ms}}</view>
							<view class="text">后结束 </view>
						</view>
					</view>
					<view class="form-btn">
						<button class="btn-price" v-if="isEmpower"  open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber"> 立即授权手机号报名</button>
						<button class="btn-price" v-if="!isEmpower" @click="clickForm"> 立即报名</button>
					</view>
				</view>
				
				<view class="tips-text">提交信息即视为同意<view style="color:#3075FE" @click="jumpAgreement">《隐私政策》</view>
				</view>
		</view>
		
		<uni-popup ref="carpop"  mask-background-color="rgba(0,0,0,.4)" safe-area="true">
			<view class="car-box">
				<view class="cancel-title">
					<view class="cancel" @click="closeModal">取消</view>
					<view class="title">选择车系</view>
				</view>
				<view class="list-box">
					<view class="list-item" v-for="(item, index) in carList" :key="item.hid" @click="selectCar(item, index)">
						<view class="title">{{item.name}}</view>
						<view class="address">
							
							<view class="distance">团购价：{{item.hidden_price}}</view>
					
						</view>
						<uni-icons v-show="item.isSelected == 1" class="icon" type="checkmarkempty" size="20"></uni-icons>
					
					</view>
				</view>
			</view>
		</uni-popup>
		
		<uni-popup  ref="citypop"  mask-background-color="rgba(0,0,0,.4)" safe-area="true">
			<view class="city-box">
				<view class="cancel-title">
					<view class="title">选择城市</view>
					<img class="cancel" src="../../static/image/ling.png" alt="" @click="closeModal">
				</view>
				<view class="city-list">
					<view class="left">
						<view :class="item.isSelect == 1 ?'is-left' : 'left-li'" v-for="item in newProvinceCityList" :key="item.hid" @click="changePro(item)">{{item.name}}</view>
					</view>
					<view class="right">
						<view :class="item.isSelect == 1 ?'is-right' : 'right-li'" v-for="item in cityList" :key="item.hid" @click="changeCity(item)">{{item.name}}</view>
					</view>
				</view>
			</view>
		</uni-popup>
		
		<uni-popup ref="popup" :mask-click="false" mask-background-color="rgba(0,0,0,.4)" safe-area="true">
			<view class="dea-box">
				<view class="cancel-title">
					<view class="city-title">
						<view class="city-name" @click="cityShow">{{cityName}}</view>
						<img src="../../static/image/xiangyou.png" alt="">
					</view>
					<view class="title">选择经销商</view>
					<img class="cancel" src="../../static/image/ling.png" alt="" @click="closeDealerModal">
				</view>
				<view class="list-box">
					<view class="list-item" v-for="item in dealerList" :key="item.hid" @click="selectDealer(item)">
						<view class="title">{{item.name}}</view>
						<view class="address">
							
							<view class="distance" v-if="item.distance != ''">{{item.distance}} | {{item.address}}</view>
							<view class="distance" v-if="item.distance == ''">{{item.address}}</view>
					
						</view>
						<uni-icons v-show="item.isSelected == 1" class="icon" type="checkmarkempty" size="20"></uni-icons>
					
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
	</view>
</template>

<script>
	const Api = require('../../utils/api.js');
	const request = require('../../utils/request.js');
	
	import {buryReport} from '../../utils/buryReport.js'
	import {deliverClickCallback} from '../../utils/deliverClickCallback.js'
	export default {
		data() {
			return {
				configList: [],
				infoData: {},
				mount_log_hid: '',
				newProvinceCityList: [],
				cityList: [],
				regionList: [],
				provinceCityIndex: [0, 0],
				phone: '',
				province_id: '',
				city_id: '',
				carId: '',
				dealerId: '',
				dealerName: '未选择购车城市',
				loc_lng: '',
				loc_lat: '',
				dealerList: [],
				code: '',
				countdown: 60,
				timeClock: null,
				isSMS: false,
				sms_code: '',
				cityName: '',
				provincenName: '',
				carHid: '',
				mount_log_hid: '',
				pages:'', //页面地址，
				pageParams: '', // 页面参数
				log_detail_hid: '',
				page_session_id: '',
				hide: 1,
				conversionTarget: 1,
				clueType: 1,
				text: '',
				isShow: true,
				phone_sign: '',
				isLocation: false,
				isEmpower: true,
				submitType: '',
				reqArgs: {},
				special_hid: '',
				carName: '',
				carList: [],
				isShowList: true,
				dea_is_show: null,
				toView: '',
				isLoading: true,
				scrollLeft: '0',
				Iheight: '',
				Iwidth: '',
				networkConnected: false,
				duration: 500,
				expire_at: '00:00:00:00',
				hours:"00",
				minutes: "00",
				seconds: '00',
				ms: '0',
				carImg: '',
				isShowbtn: false,
				isshowAllBtn: true,
				isCity: false,
				isLoactionCity: false,
				isOneNo: false,
				isCancel: 1, // 1是更换门店进来 2是城市点击
				oldCity: '',
				oldProvince: '',
				oldCityName: '',
				appIdNum: '',
				
			}
		},
		async onLoad(options) {
			
			//更换线索组件id
			const accountInfo =  uni.getEnvInfoSync()
			this.appIdNum = accountInfo.microapp.appId
			
			uni.showLoading({
				title:'加载中...'
			})
			
			console.log('网络监测')
			// 2g或没有网时
			let that = this
			uni.getNetworkType({
				success(res) {
					that.networkConnected = res.networkType == 'none' || res.networkType == '2g'
					if(res.networkType == 'none' ) {
						uni.hideLoading()
					}
				}
			})
						
			console.log(options, '团购')
			this.reqArgs = options
			this.mount_log_hid = options.mount_log_hid ?  options.mount_log_hid : ''
		
			this.special_hid = options.special_hid
			this.getInfo()
			this.getCarList()
			
			this.phone = uni.getStorageSync('empower_phone')? uni.getStorageSync('empower_phone') : ''
			this.phone_sign = uni.getStorageSync('phone_sign')? uni.getStorageSync('phone_sign') : ''
		
			if(this.phone != '') {
				this.isEmpower = false
			}
			
			// 广告访问页面数据上报
			deliverClickCallback("page_view", this.reqArgs)
			
		
			setTimeout(() => {
				console.log(uni.getStorageSync('isNetwork'), '定时器')
				if(uni.getStorageSync('isNetwork')) {
					uni.hideLoading()
					this.networkConnected = true
				}
			}, 6000)
		},
		
		
		
		async onShow() {
		
			console.log('onShow')
		  
			tt.hideHomeButton()
			
		},
		async onHide() {
			this.hide = 0
		},
			
		methods: {
			//倒计时 
			countdownTime() {
				const timer = setInterval(() => {
					const now = new Date().getTime();
					const distance =  this.infoData.end_ts - now
					if(distance <=0 ) {
						clearInterval(timer)
					}
					
					this.hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
					this.hours = this.hours <10 ?'0'+this.hours: this.hours
					this.minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
					this.minutes = this.minutes <10 ?'0'+this.minutes: this.minutes
					this.seconds = Math.floor((distance % (1000 * 60)) / 1000);
					this.seconds = this.seconds <10 ?'0'+this.seconds: this.seconds
					this.ms = Math.floor(distance % 1000 / 100);
				},100)
				
			},
			// 获取经纬度
			onGetLocationEvent() {
				let _this = this
					//用户授权经纬度
				return	new Promise((resolve, reject) => {
					tt.getLocation({
					success(res) {
						console.log(res, "经纬度")
						_this.loc_lng = res.longitude;
						_this.loc_lat = res.latitude;
						_this.isLocation = true
						resolve('success')
						 
						 // 不展示经销商
						 if(!_this.infoData.dealer_is_show){
							 _this.isShowbtn = false
							 _this.getProvince()
						 }else {
							_this.isShowbtn = true
							_this.getDealer()
							_this.getProvince()
						 }
						
					},
					fail(err) {
						// console.log(err, "err")
						_this.isLocation = false
						resolve('fail')
						
						  
						 _this.dealerName = '未选择购车城市'
						 if(_this.infoData.dealer_is_show) {
							_this.isShowbtn = false
							_this.getProvince()
						 } 
						},
					});
				})
			},
			getClickPro () {
				console.log('getClickPro')
				request.http(
				{
					url: Api.province_city,
					type: 'GET',
					header: {
						// // 'content-type': 'application/x-www-form-urlencoded',
						// 'token':uni.getStorageSync('token')
					},
					data: {
						loc_lng: this.loc_lng,
						loc_lat: this.loc_lat,
						car_style_hid: this.carHid,
						special_hid: this.special_hid
					},
					}).then(result=>{
						this.newProvinceCityList = result.data.list

						// 在有省份城市的情况下
						if(this.newProvinceCityList.length > 0) {
							// 如果上一个车没有城市 
							if(this.cityList.length == 0) {
								this.cityList = this.newProvinceCityList[0].citys
							}
							
							// 如果上一个车 没有城市 ---- 指定经销商的情况下
							if(this.provincenName == ''){
							this.provincenName = this.newProvinceCityList[0].name
							this.province_id= this.newProvinceCityList[0].hid
								
							this.cityName = this.newProvinceCityList[0].citys[0].name
							this.city_id = this.newProvinceCityList[0].citys[0].hid
							
							} else {
								this.oldProvince = this.province_id
								this.oldCity = this.city_id
								this.newProvinceCityList.map(item => {
									if(item.hid == this.oldProvince) {
										this.cityList = item.citys
									}
								})
								this.cityList.map(item => {
									if(item.hid == this.oldCity) {
										item.isSelect = 1
									} else {
										item.isSelect = 0
									}
								})
							}
						}
						
						
						
						//定位 
				       if(this.isLocation) {
						   if(result.data.list.length == 0) {
						   	this.getClickDealer()
						   } else {
							   console.log(this.isCity, "点击城市2 ")
							   console.log(this.provincenName, "this.provincenName")
							
								if(this.newProvinceCityList.length > 0) {
									this.getClickDealer()
								}
						   }
						   // 不定位
					   } else {
						   console.log('这里2')
						   console.log(this.isCity, "城市")
						   if(this.isCity) {
							  if(result.data.list.length == 0) {
							  	this.getClickDealer()
							  } else {
								if(this.newProvinceCityList.length > 0) {
									this.getClickDealer()
								}
							  } 
						   } else {
							   console.log(this.isLoactionCity, 'this.isLoactionCity')
							  if(this.isLoactionCity) {
								  this.isShowbtn = true
								  this.getClickDealer()
							  } else {
								 if(result.data.list.length != 0){
								 	this.infoData.dealer_name = "未选择购车门店"
								 	this.isshowAllBtn = true
								 	this.isShowbtn = false
								 }
								 else {
								 	this.getClickDealer()
								 } 
							  }							   
						   }
					   }
						
						
					})
			},
			getProvince (){
				console.log('getProvince')
				request.http(
				{
					url: Api.province_city,
					type: 'GET',
					header: {
						// // 'content-type': 'application/x-www-form-urlencoded',
						// 'token':uni.getStorageSync('token')
					},
					data: {
						loc_lng: this.loc_lng,
						loc_lat: this.loc_lat,
						car_style_hid: this.carHid,
						special_hid: this.special_hid
					},
					}).then(result=>{
						console.log(this.carHid, "省份城市11")
						console.log(result, "省份城市")
						
						if(result.data.list.length == 0) {
						
							this.getDealer()
						} else {
							this.newProvinceCityList = result.data.list
							this.newProvinceCityList.map((item, index) => {
								if(index == 0) {
									item.isSelect = 1
								} else {
									item.isSelect = 0
								}
							})
							
								
							this.cityList = this.newProvinceCityList[0].citys
							if(this.isLocation) {
								this.province_id = this.newProvinceCityList[0].hid
								this.city_id = this.newProvinceCityList[0].citys[0].hid
								this.cityName = this.newProvinceCityList[0].citys[0].name
								this.provincenName = this.newProvinceCityList[0].name
								this.cityList.map((item,index) => {
									if(index == 0) {
										item.isSelect = 1
									} else {
										item.isSelect = 0
									}
								})
								this.dealerName = '购车城市：'+this.provincenName + " " +  this.cityName
							} else {
								if(this.infoData.dealer_is_show){
									this.province_id = this.newProvinceCityList[0].hid
									this.city_id = this.newProvinceCityList[0].citys[0].hid
									this.cityName = this.newProvinceCityList[0].citys[0].name
									this.provincenName = this.newProvinceCityList[0].name
								} 
							}
							
						}
						
					})
			},
			
			getInfo() {
				request.http(
				{
					url: Api.group_buy_info,
					type: 'GET',
					header: {
						// // 'content-type': 'application/x-www-form-urlencoded',
						'token':uni.getStorageSync('token')
					},
					data: {
						mount_log_hid: this.mount_log_hid,
						special_hid: this.special_hid
						 // mount_log_hid: 'c7eda06b86b045a6be3167b4344532d2',
						 // special_hid: '77f8cbae6bae469d8d65f72bdb997394'
					},
					}).then(result=>{
						console.log(result, "测试信息")
						this.infoData = result.data
						uni.hideLoading()
						this.countdownTime()
						if(this.infoData.dealer_is_show){	
							this.onGetLocationEvent()
						} else {
							this.dealerId = '0'
							this.province_id = this.infoData.province_id
							this.city_id = this.infoData.city_id
							this.onGetLocationEvent()
						}
					})
			},
			
			getCarList() {
				request.http(
				{
					url: Api.car_list,
					type: 'GET',
					header: {
						// // 'content-type': 'application/x-www-form-urlencoded',
						// 'token':uni.getStorageSync('token')
					},
					data: {
						mount_log_hid: this.mount_log_hid,
						special_hid: this.special_hid
					},
					}).then(result=>{
						console.log(result, "车系")
						result.data.list.map((item, index) => {
							
							item.isSelected = 0
							if(index == 0) {
								item.isSelected = 1
							}
						})
						this.carList = result.data.list
						this.carHid = result.data.list[0].hid
						this.carImg = result.data.list[0].cover
						
						this.configList = result.data.list
						
					})
			},
			showCar() {
				this.$refs.carpop.open('bottom')
			},
			closeModal () {
				this.$refs.carpop.close()
				this.$refs.citypop.close()
			},
			//取消经销商
			closeDealerModal() {
				console.log(this.isCancel, "哪里来的")
				if(this.isCancel == 2){
					this.province_id = this.oldProvince
					this.city_id = this.oldCity
					console.log(this.oldCityName , "名字")
					this.cityName = this.oldCityName
					let arr = []
				
					this.newProvinceCityList.forEach(item => {
						if(item.hid == this.oldProvince) {
							item.isSelect = 1
							arr= item.citys
						} else {
							item.isSelect = 0
						}
						
					})
					this.cityList = arr
					this.cityList.forEach(item => {
						if(item.hid == this.oldCity) {
							item.isSelect = 1
						} else {
							item.isSelect = 0
						}
						
					})
					if(!this.isshowAllBtn) {
						this.isshowAllBtn = true
					}
				}
				
				this.$refs.popup.close()
			},
			//选择车系
			checkItem(val) {
				if(this.infoData.dealer_name != "未选择购车门店"){
					this.isShowbtn = true
				}
				this.carList.map(item => {
					if(val.hid == item.hid){
						item.isSelected = 1
					} else {
						item.isSelected = 0
					}
				})
				this.carHid = val.hid
				this.carName = val.name
				this.carImg = val.cover
				
				this.isCity = false
				
			    if(!this.isLocation) {
					this.getClickPro()
				}  else {
					this.getClickDealer()
					if(this.isOneNo || this.infoData.is_design_dealer) {
						this.getClickPro()
					}
				}
			},
			selectCar(val, index) {
				console.log(index, "index")
				this.toView = 'sv'+ val.hid
				this.scrollLeft = index * 200
				console.log(this.scrollLeft, "scrollLeft")
				this.carList.map(item => {
					if(val.hid == item.hid){
						item.isSelected = 1
					} else {
						item.isSelected = 0
					}
				})
				this.carHid = val.hid
				this.carName = val.name
				this.carImg = val.cover
				this.$refs.carpop.close()
				
				if(this.infoData.dealer_name != "未选择购车门店"){
					this.isShowbtn = true
				}
				this.isCity = false
				
				if(!this.isLocation) {
					this.getClickPro()
				}  else {
					this.getClickDealer()
					if(this.isOneNo || this.infoData.is_design_dealer) {
						this.getClickPro()
					}
				}
				
			
			},
			
			jumpAgreement() {
				uni.navigateTo({
					url:'/subPackage/personal/agreement'
				}) 
			},
			
			// 显示省份城市 
			showCity() {
	
				this.getProvince()
				
				console.log(this.cityList, "城市list")
				this.$refs.citypop.open('bottom')
			},
			
			showCityAgin(){
				this.$refs.citypop.open('bottom')	
			},
			
			//切换省份
			changePro(val) {
				this.cityList = val.citys
				this.cityList.map(item => {
					if(item.hid != this.city_id) {
						item.isSelect = 0
					}
				})
				this.province_id = val.hid
				this.provincenName = val.name
				console.log(this.provincenName, "省份")
				this.newProvinceCityList.map(item => {
					if(item.hid == val.hid){
						item.isSelect = 1
					} else {
						item.isSelect = 0
					}
				})
				
			},
			//选择城市
			changeCity(val){
				this.isCity = true
				this.cityList.map(item => {
					if(item.hid == val.hid){
						item.isSelect = 1
					} else {
						item.isSelect = 0
					}
				})
				this.cityName = val.name
				this.city_id = val.hid
				this.$refs.citypop.close()
				if(this.infoData.dealer_is_show) {
					this.$refs.popup.open('bottom')
					this.isCancel = 2
					this.getClickDealer()
				} else {
					this.dealerName = '购车城市：'+this.provincenName + " " +  this.cityName
				}
				
			},
			
			//切换经销商
			changeDian() {
				if(this.isCancel == 2) {
					this.getClickDealer()
				}
				this.oldCity = this.city_id

				this.isCancel = 1
				this.$refs.popup.open('bottom')
				this.dealerList.map(item => {
					if(this.dealerId == item.hid){
						item.isSelected = 1
					} else {
						item.isSelected = 0
					}
				})
			},
			
			//选择经销商
			selectDealer(val) {
				// this.isLocation = true
				this.dealerList.map(item => {
					if(val.hid == item.hid){
						item.isSelected = 1
					} else {
						item.isSelected = 0
					}
				})
				
				this.dealerId = val.hid
				this.infoData.dealer_name = val.name
				this.$refs.popup.close()
				this.isShowbtn = true
				
				if(!this.isLocation){
					this.isLoactionCity = true
				}
				this.oldProvince = this.province_id
				this.oldCityName = this.cityName
				this.oldCityName = this.cityName
			},
			
			cityShow() {
				this.$refs.citypop.open('bottom')
				this.$refs.popup.close()
				// 省份高亮
				this.newProvinceCityList.map(item => {
					if(item.hid == this.province_id) {
						item.isSelect = 1
					}else {
						item.isSelect = 0
					}
				})
			},
			// 点击后获取经销商
			getClickDealer() {
				request.http(
				{
					url: Api.dealer_list,
					type: 'GET',
					header: {
						// 'content-type': 'application/x-www-form-urlencoded',
						// 'token':uni.getStorageSync('token'),
					},
					data: {
						city_id: this.city_id,
						loc_lng: this.loc_lng,
						loc_lat: this.loc_lat,
						car_style_hid: this.carHid,
						special_hid: this.special_hid
					},
					}).then(result=>{
						console.log(result, "经销商点击")
						this.dealerList = result.data.list
						console.log(this.isCity, "是否点击城市")
						
						
						// 只有一个经销商的时候 不展示按钮
						this.isshowAllBtn = !result.data.is_one
						
						console.log(this.isLocation, "this.isLocation")	
						
						//指定经销商的时候
						if(this.infoData.is_design_dealer) {
							if(result.data.no_have) {
								this.isShowbtn = false
								this.infoData.dealer_name = "未选择购车门店"
								
							} else {
								// 完全没有经销商的时候
								if(result.data.list[0].name == '提交后，专属顾问将尽快与您联系'){
									this.dealerId = result.data.list[0].hid
									this.infoData.dealer_name = result.data.list[0].name
									this.isshowAllBtn = false
								} else {
									if(!this.isCity) {
										console.log('到这里')
										this.dealerId = result.data.list[0].hid
										this.infoData.dealer_name = result.data.list[0].name
										this.isShowbtn = true
									}
									
								}
								if( this.isShowbtn) {
									if(!this.isCity) {
										this.dealerId = result.data.list[0].hid
										this.infoData.dealer_name = result.data.list[0].name 
									}
								}
							} 
						} else {
							if(!this.isCity) {
								this.dealerId = result.data.list[0].hid
								this.infoData.dealer_name = result.data.list[0].name 
							}
						}
						
					})
			},
			
			// 获取经销商
			getDealer () {
				
				request.http(
				{
					url: Api.dealer_list,
					type: 'GET',
					header: {
						// 'content-type': 'application/x-www-form-urlencoded',
						// 'token':uni.getStorageSync('token'),
					},
					data: {
						city_id: this.city_id,
						loc_lng: this.loc_lng,
						loc_lat: this.loc_lat,
						car_style_hid: this.carHid,
						special_hid: this.special_hid
					},
					}).then(result=>{
						console.log(result, "经销商")
						this.dealerList = result.data.list
						console.log(this.isCity, "是否点击城市")
						
						// 通过授权定位 进来的第一次 点击经销商回显 
						if(!this.isCity) {
							if(this.isLocation){
								console.log(33)
								this.dealerList.map((item,index) => {
									if(this.dealerId == item.hid) {
										item.isSelected = 1
									} else {
										item.isSelected = 0
									}
								})
							}
						}
						// 只有一个经销商的时候 不展示按钮
						this.isshowAllBtn = !result.data.is_one
						
						console.log(this.isLocation, "this.isLocation")
						
						
						//通过授权第一次进来只有个经销商的话 只展示经销商 不展示按钮
						if(this.isLocation) {
							if(!result.data.no_have) {
								if(!this.isCity) {
									this.dealerId = result.data.list[0].hid
									this.infoData.dealer_name = result.data.list[0].name
									this.isShowbtn = true
								}
							} else {
								this.isShowbtn = false
								this.infoData.dealer_name = "未选择购车门店"
							}
						}		
						
						if(result.data.no_have) {
							this.isShowbtn = false
							this.infoData.dealer_name = "未选择购车门店"
							
						} else {
							// 完全没有经销商的时候
							if(result.data.list[0].name == '提交后，专属顾问将尽快与您联系'){
								console.log(333)
								this.dealerId = result.data.list[0].hid
								this.infoData.dealer_name = result.data.list[0].name
								this.isshowAllBtn = false
								this.isOneNo = true
							} else {
								if(!this.isCity) {
									 this.dealerId = result.data.list[0].hid
									 this.infoData.dealer_name = result.data.list[0].name
								}
								
							}
							if( this.isShowbtn) {
								if(!this.isCity) {
									this.dealerId = result.data.list[0].hid
									this.infoData.dealer_name = result.data.list[0].name 
								}
							}
						} 
					})
			},
			
			// 获取手机号
			onGetPhoneNumbers(e) {
			if(e.detail.errNo != 10200) {
				request.http(
				{
					url: Api.decrypt_phone,
					type: 'POST',
					header: {
						// 'content-type': 'application/x-www-form-urlencoded',
						'token':uni.getStorageSync('token'),
					},
					data: {
						encrypted_data: e.detail.encryptedData,
						iv: e.detail.iv,
					},
					}).then(result=>{
						this.phone = result.data.encode_phone
						this.phone_sign = result.data.phone_sign
						uni.setStorageSync('empower_phone', this.phone)
						uni.setStorageSync('phone_sign', this.phone_sign)
			
					})
				}	
			},
			onGetPhoneNumber (e) {
				console.log(e, '3')
				this.isShow = true
			
				
				if(e.detail.errNo != 10200) {
					request.http(
					{
						url: Api.decrypt_phone,
						type: 'POST',
						header: {
							// 'content-type': 'application/x-www-form-urlencoded',
							'token':uni.getStorageSync('token'),
						},
						data: {
							encrypted_data: e.detail.encryptedData,
							iv: e.detail.iv,
						},
						}).then(result=>{
							this.phone = result.data.encode_phone
							this.phone_sign = result.data.phone_sign
							uni.setStorageSync('empower_phone', this.phone)
							uni.setStorageSync('phone_sign', this.phone_sign)
							
							
							this.formClick(1)
							
						})
				} else {
					console.log('拒绝')
					this.isEmpower = false
					// this.formClick()
				}
				
			},
			
			inputChange (e) {
				console.log(e, '手机号')
				if(this.phone.length == 11){
					this.isShow = false
					this.phone_sign = ''
				} else if(this.phone.length == 0){
					this.isShow = true
					this.phone_sign = ''
				}
				
			},
			getSMS(){
				if(this.phone == '') {
					uni.showToast({
						title:'请输入手机号',
						icon: "none"
					})
					return
				}
				
				request.http(
				{
					url: Api.getCode,
					type: 'POST',
					header: {
						// 'content-type': 'application/x-www-form-urlencoded',
						//  'token':uni.getStorageSync('token'),
					},
					data: {
						cate: 9,
						phone: this.phone
						},
					}).then(result=>{
						this.setTime()
						this.isSMS = true
					})
			},
			
			setTime(val) {
				   let that=this; 
				   
					if(this.countdown==0){
					this.countdown=60;
					clearTimeout(that.timeClock)
					this.isSMS = false
					}else{
					this.countdown--;
					this.timeClock=setTimeout(()=>{
					that.setTime();   
					},1000)
				   }
			},
			
			clickForm() {
				this.formClick(1)
			},
			
			
			formClick (val) {
			if(val != 1) {
				console.log('不走')
				return
			}
				
				this.isEmpower = false
					
			if(this.infoData.dealer_is_show && this.infoData.dealer_name == "未选择购车门店") {
				uni.showToast({
					title:'请选择购车门店',
					icon: "none"
				})
				return
			}
			
			if(!this.infoData.dealer_is_show && this.dealerName == "未选择购车城市") {
				uni.showToast({
					title:'请选择购车城市',
					icon: "none"
				})
				return
			}
			if(this.phone == '') {
				uni.showToast({
					title:'请输入手机号',
					icon: "none"
				})
				return
			}
			
			
			if( !this.isShow && this.sms_code == '') {
				uni.showToast({
					title:'请输入验证码',
					icon: "none"
				})
				return
			}
			let obj = {
				adid: this.reqArgs.adid,
				creativeid: this.reqArgs.creativeid,
				creativetype: this.reqArgs.creativetype,
				clickid: this.reqArgs.clickid,
			}
			console.log(this.carHid, "车系id")
			console.log(this.mount_log_hid, "mount_log_hid111")
	
			request.http(
			{
				url: Api.leave_clue,
				type: 'POST',
				header: {
					// 'content-type': 'application/x-www-form-urlencoded',
					'token':uni.getStorageSync('token'),
				},
				data: {
					cate: 9,
					province_id: this.province_id  == '' ? this.infoData.province_id : this.province_id,
					city_id: this.city_id  == '' ? this.infoData.city_id : this.city_id,
					style_hid: this.carHid,
					dea_hid: this.dealerId,
					phone: this.phone_sign == '' ? this.phone : '' ,
					sms_code: this.sms_code,
					mount_log_hid: this.mount_log_hid ,
					phone_cate: this.isShow ? 1 : 2,
					phone_sign: this.phone_sign,
					special_hid: this.special_hid,
					dy_ad: obj
				},
				}).then(result=>{
					if(result.data.is_send_sms) {
						console.log('成功')
						deliverClickCallback("form" , this.reqArgs)
					}
					let info = encodeURIComponent(JSON.stringify(this.infoData))
					uni.navigateTo({
						url:`/subPackage/groupBuying/success?infoData=${info}&carImg=${this.carImg}&special_hid=${result.data.special_hid}&douyin_name=${result.data.nickname}&douyin_num=${result.data.account_num}&phone=${result.data.phone}&is_send_sms=${result.data.is_send_sms}&kol_id=${result.data.kol_id}&style_hid=${this.carHid}`
					})
					this.isEmpower = false
					this.sms_code =''
				}).catch(err => {
					console.log(err, "333")
				})
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	.box-list {
		background: #F5F9FC; 
		.method-box {
			padding: 0 21rpx;
			box-sizing: border-box;
			margin-top: 21rpx;
			.mount-method {
				border-radius: 7rpx;
				height: 109rpx;
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				background: #fff;
				font-size: 31rpx;
				margin-bottom: 21rpx;
				box-sizing: border-box;
				padding: 0 21rpx;
				box-sizing: border-box;
				.picker-view {
					color: #6E7175;
					font-size: 27rpx;
					display: flex;
					align-items: center;
				}
				.right {
					display: flex;
					align-items: center;
					.text{
						font-size: 27rpx;
						font-weight: 400;
						color: #6E7175;
					}
				}
			}
		}
		
		
		.page-list {
			height: 100vh;
			font-size: 31rpx;
			margin-top: 20rpx;
			padding: 0 21rpx;
			box-sizing: border-box;
			.tips {
				font-size: 25rpx;
				font-weight: 400;
				color: #6E7175;
				padding-bottom:28rpx;
			}
			.list-item {
				width:100%;
				height: 178rpx;
				background: #FFFFFF;
				border-radius: 7rpx;
				display: flex;
				align-items: center;
				margin-bottom: 20rpx;
				padding: 0 15rpx;
				box-sizing: border-box;
				.left {
					height: 100%;
					display: flex;
					align-items: center;
					img {
						width: 199rpx;
						height: 134rpx;
						
					}
				}
				.middle {
					height: 100%;
					flex: 1;
					display: flex;
					flex-direction: column;
					justify-content:center;
					.name {
						font-size: 31rpx;
						font-weight: 500;
						color: #222526;
						margin-bottom: 18rpx;
					}
					.price {
						font-size: 22rpx;
						font-weight: 400;
						color: #6E7175;
					}
				}
				
				.right {
						.btn{
							width: 137rpx;
							height: 58rpx;
							background: #3075FE;
							border-radius: 4rpx;
							font-size: 22rpx;
							font-weight: 500;
							color: #FFFFFF;
							line-height: 58rpx;
						}
					}
			}
		}
	}
	.page {
		width: 100%;
		height: 100vh;
		background: #fff;
		.big-bg {
			width: 100%;
			height: 368rpx;
			position: relative;
			.up {
				width: 100%;
				padding:24rpx 22rpx 0rpx ;
				box-sizing: border-box;
				position: absolute;
				top: 0;
				left: 0;
				.info{
					width: 100%;
					height: 236rpx;
					position: relative;
					
					image {
						width: 100%;
						position: absolute;
						top: 15rpx;
						left: 0;
					}
					.phone {
						width: 100%;
						display: flex;
						align-items: center;
						justify-content: center;
						position: absolute;
						top: 22rpx; 
						left: 0;
						.laba {
							width: 40rpx;
							height: 40rpx;
							position:static;
						}
						.swiper {
							height: 40rpx;
							width:250rpx;
							.num{
								font-weight: 400;
								font-size: 24rpx;
								color: #222526;
								margin:3rpx 20rpx 0;
								line-height: 40rpx;
							}
						}
						.gu {
							font-weight: 400;
							font-size: 24rpx;
							color: #6E7175;
						}
					}
					.group-info {
						position: absolute;
						top: 22rpx; 
						left: 0;
						width: 100%;
						display: flex;
						flex-direction: column;
						margin-top: 65rpx;
						padding: 0 38rpx;
						box-sizing: border-box;
						.title-top {
							width: 100%;
							font-weight: 600;
							font-size: 34rpx;
							color: #222526;
							margin-bottom: 16rpx;
							margin-top: 30rpx;
						}
						.title {
							width: 100%;
							font-weight: 600;
							font-size: 34rpx;
							color: #222526;
							margin-bottom: 16rpx;
						}

						.dingwei {
							width: 100%;
							display: flex;
							justify-content: space-between;
							align-items: center;
							.left {
								display: flex;
								align-items: center;
								img {
									width: 44rpx;
									height: 44rpx;
									position: static;
									margin-right: 10rpx;
								}
								.time-name {
									font-weight: 400;
									font-size: 26rpx;
									color: #222526;
								}
							}
							.btn-text {
								font-weight: 400;
								font-size: 26rpx;
								color: #3075FE;
							}
						}
					}
				}
			}
			
		}
		
		.scroll-box {
			width: 100%;
			height: 228rpx;
			display: flex;
			margin-top: -15rpx;
			padding: 0 32rpx;
			box-sizing: border-box;
			.scroll-list, .scroll-short {
				background: #F6F7FC;
				width: 91.5%;
				white-space: nowrap;
				border-radius:8rpx 0rpx 0rpx 0rpx;
				.car-item {
					
					display: inline-block;
					width: 195rpx;
					height: 210rpx;
					position: relative;
					margin: 10rpx 0rpx 10rpx 10rpx;
					 background: #fff;
					.check {
						width: 43rpx;
						height: 43rpx;
						position: absolute;
						top: 16rpx;
						right: 16rpx;
						img {
							width: 100%;
							height: 100%;
						}
					}
					.img-title {
						width: 100%;
						height: 100%;
						display: flex;
						flex-direction: column;
						align-items: center;
						justify-content: center;
						background: #fff;
						border-radius: 7rpx;
						img{
							width: 181rpx;
							height: 120rpx;
						}
						.title {
							width: 175rpx;
							font-size: 24rpx;
							font-weight: 400;
							color: #222526;
							overflow:hidden;
							text-overflow:ellipsis;
							white-space:nowrap;
							text-align: center;
							margin-top: -10rpx;
						}
						.group-price {
							width: 100%;
							display: flex;
							justify-content: center;
							align-items: center;
							margin-top: 6rpx;
							.group{
								font-weight: 400;
								font-size: 22rpx;
								color: #FF3322;
								border: 2rpx solid #FF3322;
								border-radius: 4rpx;
								margin-right: 6rpx;
								width: 80rpx;
								height: 36rpx;
								line-height: 36rpx;
								text-align: center;
								
							}
							.price {
								font-weight: 400;
								font-size: 24rpx;
								color: #FF3322;
								
							}
						}
					}					
				}
			}
			
			.scroll-short {
				background: #F6F7FC;
				width: 100%;
				white-space: nowrap;
			}
		
			.all-car {									
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				width: 58rpx;
				height: 228rpx;
				background: #F6F7FC;
				border-radius:0rpx 8rpx 0rpx 0rpx;
				img {
					width: 18rpx;
					height: 18rpx;
				}
				.all {
					height: 113rpx;
					font-size: 22rpx;
					font-weight: 500;
					color: #222526;
					writing-mode: tb-rl;
					text-align: center;
					 letter-spacing: 7rpx;
				}
			}
		}
		.phone-box {
			padding: 0 32rpx;
			box-sizing: border-box;
			.item {
				display: flex;
				width: 100%;
				height: 103rpx;
				align-items: center;
				border-bottom: 1rpx solid #DCDDE0;
				
				
				.left, .middle {
					
					font-weight: 400;
					color: #222526;
					font-size: 29rpx;
				}
				.left {
					width: 116rpx;
					color:#6E7175;
					font-size: 28rpx;
				}
				.middle {
					flex:1 ;
					margin-left: 47rpx;
					overflow: hidden;
					text-overflow:ellipsis;    
					white-space: nowrap;
				}
				.right{ 
					img {
						width: 43rpx;
						height: 43rpx;
						margin-top: 25rpx;
					}
					.btn {
						font-weight: 400;
						color: #3075FE;
						font-size: 29rpx;
					
						background: none;
					
					}
					button::after{ border: none; }
				}
			}
			
		}
		
		.btn-box {
			width: 100%;
			height: 124rpx;
			background: #F6F7FC;
			display: flex;
			box-sizing: border-box;
			justify-content: space-between;
			align-items: center;
			padding: 0 32rpx;
			box-sizing: border-box;
			position: fixed;
			bottom: 80rpx;
			left: 0;
			.people {
				display: flex;
				flex-direction: column;
				justify-content: center;
				.top {
					font-weight: 500;
					font-size: 28rpx;
					color: #222526;
					margin-bottom: 6rpx;
				}
				.dao-time {
					display: flex;
					align-items: center;
					.text {
						font-weight: 400;
						font-size: 24rpx;
						color: #222526;
						margin-left: 10rpx;
					}
					.red {
						width: 35rpx;
						height: 34rpx;
						font-weight: 600;
						font-size: 24rpx;
						color: #FFFFFF;
						background: #FF6340;
						border-radius: 4rpx;
						text-align: center;
						line-height: 34rpx;
					}
					.dian {
						color: #FF6340;
						margin: -5rpx 5rpx 0
					}
				}
			}
			.form-btn {
				.btn-price {
					width:360rpx;
					height: 94rpx;
					background-image: linear-gradient(90deg, #FF6340 0%, #FF943C 100%);
					border-radius: 4rpx;
					font-weight: 500;
					color: #FFFFFF;
					font-size: 32rpx;
					line-height: 96rpx;
				}
			}
		}
		
		.tips-text {
			font-weight: 400;
			color: #6E7175;
			font-size: 24rpx;
			display: flex;
			justify-content: center;
			position: fixed;
			bottom: 40rpx;
			left: 50%;
			transform: translateX(-50%);
		}
		.car-box{
			width: 100%;
			height: 942rpx;
			overflow-y: auto;
			background: #FFFFFF;
			padding:0 29rpx;
			box-sizing: border-box;
			display: flex;
			flex-direction: column;
			.cancel-title {
				width: 100%;
				display: flex;
				align-items: center;
				padding: 29rpx 0;
				box-sizing: border-box;
				border-bottom: 1rpx solid #DCDDE0;
		
				.cancel {
					font-weight: 400;
					color: #222526;
					font-size: 29rpx;
				}
				.title {
					flex: 1;
					text-align: center;
					font-weight: 500;
					color: #222526;
					font-size: 33rpx;
				}
			}
			.list-box {
				width: 100%;
				overflow-y: auto;
				.list-item {
					width: 100%;
					padding-top: 20rpx;
					display: flex;
					flex-direction: column;
					box-sizing: border-box;
					
					position: relative;
					
					.icon {
						position:absolute;
						top:40%;
						right: 20rpx;
						transform: translate(0, -40%);
					}
					.title {
						font-weight: 500;
						color: #222526;
						font-size: 29rpx;
						margin-bottom: 15rpx;
					}
					.address {
						display: flex;
						font-weight: 400;
						font-size: 22rpx;
						color: #6E7175;
						border-bottom: 2rpx solid #DCDDE0;
						padding-bottom:23rpx ;
						padding-right:100rpx;
						.gang {
							margin: 0 10rpx;
						}
					}
				}
			}
			
		}
		.city-box {
			width: 100%;
			height: 942rpx;
			background: #fff;
			display: flex;
			flex-direction: column;
			border-radius: 8rpx 8rpx 0 0;
			.cancel-title {
				width: 100%;
				padding: 29rpx 0;
				box-sizing: border-box;
				position: relative;
				.cancel {
					width: 48rpx;
					height: 48rpx;
					margin-right: 32rpx;
					position: absolute;
					right: 32rpx;
					top:25rpx;
				}
				.title {
					width: 100%;
					text-align: center;
					font-weight: 500;
					font-size: 36rpx;
					color: #222526
				}
			}
			.city-list {
				width: 100%;
				flex: 1;
				display: flex;
				overflow: hidden;
				.left {
					width: 49%;
					height: 100%;
					display: flex;
					flex-direction: column;
					background: #F6F7FC;
					overflow-y: auto;
					overflow-x: hidden;
					
					.left-li {
						width: 414rpx;
						height: 96rpx;
						text-align: center;
						line-height: 96rpx;
						font-weight: 500;
						font-size: 32rpx;
						color: #222526;
						text-align: center;
					}
					.is-left{
						background: #FFFFFF;
						color: #3075FE;
						width: 414rpx;
						height: 96rpx;
						font-size: 32rpx;
						text-align: center;
						line-height: 96rpx;
						font-weight: 500;
					}
					
				}
				.right{
					flex: 1;
					height: 100%;
					display: flex;
					flex-direction: column;
					overflow-y: auto;
					.right-li {
						width: 414rpx;
						height: 96rpx;
						text-align: center;
						line-height: 96rpx;
						font-weight: 500;
						font-size: 32rpx;
						color: #222526;
						text-align: center;
					}
					.is-right{
						width: 414rpx;
						height: 96rpx;
						text-align: center;
						line-height: 96rpx;
						font-weight: 500;
						font-size: 32rpx;
						color: #3075FE;;
						text-align: center;
					}
				}
			}
		}
		 .dea-box {
			width: 100%;
			height: 942rpx;
			overflow-y: auto;
			background: #FFFFFF;
			padding:0 29rpx;
			box-sizing: border-box;
			display: flex;
			flex-direction: column;
			.cancel-title {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 29rpx 0;
				box-sizing: border-box;
				border-bottom: 1rpx solid #DCDDE0;
		
				.city-title {
					display: flex;
					align-items: center;
					
					.city-name {
						font-weight: 400;
						font-size: 32rpx;
						color: #3075FE;
					}
					img {
						width: 48rpx;
						height: 48rpx;
					}
				}
				.title {
					text-align: center;
					font-weight: 500;
					color: #222526;
					font-size: 33rpx;
					margin-left: -30rpx;
				}
				.cancel {
					width: 48rpx;
					height: 48rpx;
				}
			}
			.list-box {
				width: 100%;
				overflow-y: auto;
				.list-item {
					width: 100%;
					padding-top: 20rpx;
					display: flex;
					flex-direction: column;
					box-sizing: border-box;
					
					position: relative;
					
					.icon {
						position:absolute;
						top:40%;
						right: 20rpx;
						transform: translate(0, -40%);
					}
					.title {
						font-weight: 500;
						color: #222526;
						font-size: 29rpx;
						margin-bottom: 15rpx;
					}
					.address {
						display: flex;
						font-weight: 400;
						font-size: 22rpx;
						color: #6E7175;
						border-bottom: 2rpx solid #DCDDE0;
						padding-bottom:23rpx ;
						padding-right:100rpx;
						.gang {
							margin: 0 10rpx;
						}
						.distance {
							// display: flex;
							// padding-right:100rpx;
							
						}
						
					}
				}
			}
			
		}
		
	}
</style>